import 'dart:ui';

import 'package:flutter/material.dart';
import 'package:flutter_study/flutter/_06%E8%A7%A6%E6%91%B8%E4%BA%8B%E4%BB%B6%E3%80%81%E4%B8%BB%E9%A2%98/size_fit.dart';

import '../ext/double_extension.dart';

void main() => runApp(MyApp());

/*
 *  Flutter使用iOS中的点 pt，即point
 */
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    SizeFit.init();
    // 获取手机物理分辨率
    final phoneWidth = window.physicalSize.width;
    final phoneHeight = window.physicalSize.height;
    print('手机物理分辨率：width = $phoneWidth,height = $phoneHeight');

    // 逻辑分辨率,此时没有context，MediaQuery无法初始化，使用该方法获取会报错，在之后的context中可以获取
    /*var screenWidth = MediaQuery.of(context).size.width;
    var screenHeight = MediaQuery.of(context).size.height;*/

    // 在此处获取屏幕宽高的方式 物理宽高/dpi
    final dpi = window.devicePixelRatio;
    print('计算获取屏幕宽高：width = ${phoneWidth / dpi},height = ${phoneHeight / dpi}');

    // 使用padding获取状态栏高度,window获取的都是物理值，需要除dpi
    final statusHeight = window.padding.top / dpi;
    print('计算获取api获取状态栏高度：$statusHeight');

    return MaterialApp(
      title: 'Flutter中的单位',
      theme: ThemeData(
        primarySwatch: Colors.blue,
        splashColor: Colors.transparent,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: Text('Flutter中的单位'),
        ),
        body: HomePage(),
      ),
    );
  }
}

// 假设字体大小为x，屏幕小为x，屏幕大变为2x 3x...
class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var screenWidth = MediaQuery.of(context).size.width;
    var screenHeight = MediaQuery.of(context).size.height;
    print('使用系统api获取屏幕宽高：width = $screenWidth,height = $screenHeight');
    final statusHeight = MediaQuery.of(context).padding.top;
    print('使用系统api获取状态栏高度：$statusHeight');
    return Center(
      // 此处width、height、fontSize都是*2的结果，因为rpx是除750 而非375
      child: Container(
        alignment: Alignment.center,
        /*width: 200 * SizeFit.rpx,
        height: 200 * SizeFit.rpx,*/
        width: SizeFit.setRpx(200),
        // 使用扩展方法
        // height: 200.0.px(),
        // 提供了double的getter方法之后,就可以省略括号
        height: 200.0.rpx,
        color: Colors.yellow,
        child: Text(
          "Hello World!",
          style: TextStyle(fontSize: 20 * SizeFit.rpx),
        ),
      ),
    );
  }
}
